<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--<meta name="viewport" content="width=device-width, 2.initial-scale=1.0, 3.maximum-scale=1.0, 4.user-scalable=no">-->
    <link rel="stylesheet" href="__CSS__/bootstrap.min.css">
    <link rel="stylesheet" href="__CSS__/curriculum.css">
    <!--<link href="__CSS__/admin/Course/addcourse.css" rel="stylesheet">-->
    <link href="__CSS__/admin/Website/addmodule.css" rel="stylesheet">
    <link href="__CSS__/style.css?v=4.1.0" rel="stylesheet">
    <link href="__CSS__/animate.css" rel="stylesheet">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <![endif]-->
    <script src="__JS__/jquery-1.11.3.js"></script>
    <script src="__JS__/bootstrap.min.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>

    <style>
        #file {
            position: relative;
            display: inline-block;
            background: #D0EEFF;
            border: 1px solid #99D3F5;
            border-radius: 4px;
            padding: 4px 12px;
            overflow: hidden;
            color: #1E88C7;
            text-decoration: none;
            text-indent: 0;
            line-height: 20px;
        }
        #file input {
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
        }
        #files {
            position: relative;
            display: inline-block;
            background: #D0EEFF;
            border: 1px solid #99D3F5;
            border-radius: 4px;
            padding: 4px 12px;
            overflow: hidden;
            color: #1E88C7;
            text-decoration: none;
            text-indent: 0;
            line-height: 20px;
        }
        #files input {
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
        }
        .title{
            width: 20rem;
        }
    </style>


<body>

<div class="index container">
    <div class="col-sm-12 col-xs-12 ">
        <a  class="btn btn-lg btn-danger"   href='javascript:history.go(-1)'>返回</a>
    </div>
    <form id="forms" action="{:url('Occupation/update_true')}" method="post" enctype="multipart/form-data">
        <input type="hidden" name="pid" value="{$picture.pid}">
        <div><div class="title">名字</div>  <input type="text"  name="name"  onsubmit="submit()" value="{$picture.pcontent}"></div>
        <div><div class="title">图片</div>
                                              <div class="btn btn-lg center-block  " type="text"  id="files" > <span>选择文件</span>
                                                  <input type="file" id="addfile" name="files" onchange="chang(this)" ></div>
        </div>

        <button type="submit" class="btn btn-lg center-block">确认修改</button>
    </form>
</div>
</body>
</html>
<script>
    var chengeurl="{:url('Website/addchange')}";
    function changges(selectid,classname) {
        $.ajax({
            url: chengeurl,
            type: "post",
            dataType: "json",
            data: {
                classname:classname
            },
            success: function (data) {
                $("#select"+selectid).empty();
                for (var i = 0; i < Object.keys(data).length; i++) {  //获取data长度   循环遍历出来
                    $("#select"+selectid).append('<option value=' + data[i].id + '>' + data[i].record_name + '</option>')
                }
            },
            error: function (e) {
                alert(e.response)
            }
        })
    }
    $("#forms").validate({
        rules:{
            name:{
                required:true,
            },
            content1:{
                required:true
            } ,
            content2:{
                required:true
            },
            content3:{
                required:true
            }
        }
    });
    $.validator.setDefaults({
        submitHandler: function() {

            submit();
        }
    });
    function chang(obg) {
        if($(obg).val()==""){
            $(obg).siblings("span").text("选择文件")
        }else{disabled="disabled";
            $("#button1").css("disabled","disabled")
            $(obg).siblings("span").text($(obg).val())
        }
    }
</script>